<template>
	<view>
		<u-navbar :is-back="true" title="报名人员名单">
			<view slot="right" class="shenhe" @click="showModal">
				<image src="../../../static/img/acitivity/guanli.png" class="shenhe-icon"></image>
				<text class="shenhe-text color5">一键审核</text>
			</view>
		</u-navbar>
		<view class="renyuan-list">
			<view class="renyuan-list-cell">
				<image src="../../../static/demo/1.jpg" class="renyuan-tx"></image>
				<view class="renyuan-name">小骆</view>
				<u-button shape="circle" hover-class="none" :hair-line="false" class="tongyi-btn">同意</u-button>
			</view>
			<view class="renyuan-list-cell">
				<image src="../../../static/demo/1.jpg" class="renyuan-tx"></image>
				<view class="renyuan-name">小骆</view>
				<u-button shape="circle" hover-class="none" :hair-line="false" class="jujue-btn">已拒绝</u-button>
			</view>
			<view class="renyuan-list-cell">
				<image src="../../../static/demo/1.jpg" class="renyuan-tx"></image>
				<view class="renyuan-name">小骆</view>
				<u-button shape="circle" hover-class="none" :hair-line="false" class="tongyi-btn">同意</u-button>
			</view>
			<view class="renyuan-list-cell">
				<image src="../../../static/demo/1.jpg" class="renyuan-tx"></image>
				<view class="renyuan-name">小骆</view>
				<u-button shape="circle" hover-class="none" :hair-line="false" class="jujue-btn">已拒绝</u-button>
			</view>
			<view class="renyuan-list-cell">
				<image src="../../../static/demo/1.jpg" class="renyuan-tx"></image>
				<view class="renyuan-name">小骆</view>
				<u-button shape="circle" hover-class="none" :hair-line="false" class="tongyi-btn">同意</u-button>
			</view>
			<view class="renyuan-list-cell">
				<image src="../../../static/demo/1.jpg" class="renyuan-tx"></image>
				<view class="renyuan-name">小骆</view>
				<u-button shape="circle" hover-class="none" :hair-line="false" class="jujue-btn">已拒绝</u-button>
			</view>
			<view class="renyuan-list-cell">
				<image src="../../../static/demo/1.jpg" class="renyuan-tx"></image>
				<view class="renyuan-name">小骆</view>
				<u-button shape="circle" hover-class="none" :hair-line="false" class="tongyi-btn">同意</u-button>
			</view>
			<view class="renyuan-list-cell">
				<image src="../../../static/demo/1.jpg" class="renyuan-tx"></image>
				<view class="renyuan-name">小骆</view>
				<u-button shape="circle" hover-class="none" :hair-line="false" class="jujue-btn">已拒绝</u-button>
			</view>
			<view class="renyuan-list-cell">
				<image src="../../../static/demo/1.jpg" class="renyuan-tx"></image>
				<view class="renyuan-name">小骆</view>
				<u-button shape="circle" hover-class="none" :hair-line="false" class="tongyi-btn">同意</u-button>
			</view>
			<view class="renyuan-list-cell">
				<image src="../../../static/demo/1.jpg" class="renyuan-tx"></image>
				<view class="renyuan-name">小骆</view>
				<u-button shape="circle" hover-class="none" :hair-line="false" class="jujue-btn">已拒绝</u-button>
			</view>
			<view class="renyuan-list-cell">
				<image src="../../../static/demo/1.jpg" class="renyuan-tx"></image>
				<view class="renyuan-name">小骆</view>
				<u-button shape="circle" hover-class="none" :hair-line="false" class="tongyi-btn">同意</u-button>
			</view>
			<view class="renyuan-list-cell">
				<image src="../../../static/demo/1.jpg" class="renyuan-tx"></image>
				<view class="renyuan-name">小骆</view>
				<u-button shape="circle" hover-class="none" :hair-line="false" class="jujue-btn">已拒绝</u-button>
			</view>
		</view>
		<u-modal v-model="show" @confirm="confirm" :content="shenheContent" ref="uModal" :mask-close-able="true" title="一键审核" cancel-text="拒绝所有" confirm-text="同意所有" :show-cancel-button="true" cancel-color="#ff0000" confirm-color="#2ea34a"></u-modal>
		<tarBer :totarBer='tar'></tarBer>
	</view>
</template>

<script>
	import tarBer from '../../../components/tabBarFoot/tabBarFoot.vue'
	export default {
		components:{
				 tarBer
			 },
		data() {
			return {
				tar:{
						color:'#fff',
						id:1		 
				},
				show: false,
				shenheContent:'点击一键审核可以快速审核报名人员，你也可以在创建活动是设置自动审核'
			};
		},
		methods:{
			showModal() {
			this.show = true;
		},
		confirm() {
			setTimeout(() => {
				// 3秒后自动关闭
				this.show = false;
				// 如果不想关闭，而单是清除loading状态，需要通过ref手动调用方法
				// this.$refs.uModal.clearLoading();
			}, 3000)
		}
		}
	}
</script>

<style lang="scss">
page{
	background-color: #e6e6e6;
}
.renyuan-list{
	margin-top: 5rpx;
	padding-bottom: 95rpx;
}
.shenhe{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin-right: 40rpx;
	.shenhe-icon{
		width: 48rpx;
		height: 48rpx;
	}
	.shenhe-text{
		font-size: 20rpx !important;
	}
}
.renyuan-list-cell{
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 2rpx;
	background-color: #FFFFFF;
	padding: 25rpx 40rpx;
	.renyuan-tx{
		width: 90rpx;
		height: 90rpx;
		border-radius: 90rpx;
	}
	.renyuan-name{
		flex: 1;
		margin-left: 30rpx;
		font-size: 28rpx;
	}
	.tongyi-btn{
		color: #2ea34a;
		width: 140rpx;
		height: 50rpx;
		line-height: 50rpx;
		border-radius: 20rpx;
		border-color: #bfbfbf;
		font-size: 24rpx;
	}
	.jujue-btn{
		color: #ff0000;
		width: 140rpx;
		height: 50rpx;
		line-height: 50rpx;
		border-radius: 20rpx;
		border-color: #bfbfbf;
		font-size: 24rpx;
	}
}
</style>
